<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>adidas首页</title>
</head>
<link rel="stylesheet" href="./css/sunying/iconfont.css">
<link rel="stylesheet" href="./css/sunying/首页.css">
<link rel="stylesheet" href="./bootstrap-3.3.7-dist/css/bootstrap.css">
<body>
<!--导航-->
<div class="header-fixed">
    <div class="top-nav">
        <div class="header-top">
            <ul>
                <li><a href="#">订单追踪</a><i class="icon-new icon-order-tracking"></i></li>
                <li><a href="#">帮助中心</a> <i class="icon-new icon-help-center"></i></li>
                <li class="service"><a href="#">在线客服</a> <i class="icon-new icon-service"></i></li>
                <li class="login-box"><a href="#">登录</a> <i class="icon-new icon-login"></i></li>
            </ul>
        </div>
        <!--导航-->
        <div class="header-container">
            <div class="header-left">
                <h1 class="navbar-header">
                    <a href="#">
                        <img src="./images/孙莹/logo-new.png" alt="">
                    </a>
                </h1>
                <div class="nav-menu">
                    <ul class="nav-pills">
                        <li class="Extention"><a href="#">男子</a></li>
                        <li class="Extention"><a href="#">女子</a></li>
                        <li class="Extention"><a href="#">儿童</a></li>
                        <li class="nav-menu-delimiter"><span></span></li>
                        <li class="Extention"><a href="#">运动</a></li>
                        <li class="Extention"><a href="#">品牌</a></li>
                        <li class="Extention"><a href="#">精选系列</a></li>
                    </ul>
                </div>
            </div>
            <div class="header-right">
                <div class="form-search">
                    <form action="" id="keysearch" method="get">
                        <input type="text" id="keyword" placeholder="ozwoog">
                        <input type="hidden" id="keywords" name="keyword">
                        <a href="#"><i class="icon icon-search"></i></a>
                    </form>
                </div>
                <div class="header-cart">
                    <a href="#"><i class="icon-new icon-cart"></i></a>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="row">
    <!--即将发售-->
<div class="swiper-slide">
    <form class="identifySoon">
     <a href="#"><img src="./images/孙莹/1920-720-cloudwhite.jpg" width="100%" alt="">
     </a>
<div class="item-info">
    <a href="#" class="btn-have-opacity">
        即将发售<span class="icon iconfont iconchangyongtubiao-xianxingdaochu-zhuanqu- gd">
        </span>
    </a>
</div>
    </form>
</div>

<!--立即抢购-->
    <div class="sub-banner">
   <div class="banner-item">
       <div class="item-wrapper">
           <a href="#">
         <img src="./images/孙莹/924-613-70zn-20-22.jpg" alt="">
           </a>
       </div>
       <div class="item-info font-black">
           <a href="#" class="btn-have-opacity gl-color-white">
         立即抢购<span class="icon iconfont iconchangyongtubiao-xianxingdaochu-zhuanqu- gd">
        </span>
           </a>
       </div>
   </div>


    <div class="banner-item">
     <div class="item-wrapper">
      <a href="#">
       <img src="./images/孙莹/924-613-70zn-nzt.jpg" alt="">
          </a>
        </div>
        <div class="item-info font-black">
            <a href="#" class="btn-have-opacity gl-color-white">
           立即抢购<span class="icon iconfont iconchangyongtubiao-xianxingdaochu-zhuanqu- gd">
        </span>
            </a>
        </div>
        </div>
    </div>

<!--热门精选-->
<div class="remen">
    <div class="you-like">
<div class="swiper-active">
    <div class="thumbnail1">
    <a href="#">
        <img src="./images/孙莹/1960s-70zn.jpg" alt="">
        <p class="text">查看1960s经典</p>
    </a>
    </div>
</div>
   <div class="swiper-active">
    <div class="thumbnail1">
      <a href="#">
      <img src="./images/孙莹/1970s-70zn.jpg" alt="">
        <p class="text">查看1970s经典</p>
       </a>
       </div>
    </div>

   <div class="swiper-active">
     <div class="thumbnail1">
    <a href="#">
       <img src="./images/孙莹/1980s-70zn.jpg" alt="">
        <p class="text">查看1980s经典</p>
         </a>
      </div>
      </div>
  <div class="swiper-active">
   <div class="thumbnail1">
     <a href="#">
   <img src="./images/孙莹/2010s-70zn.jpg" alt="">
       <p class="text">查看2010s经典</p>
     </a>
     </div>
     </div>
    </div>
</div>

<!--kv-images-->
    <div class="artile-kv-images">
        <img src="./images/孙莹/1920-720-hoc-01.jpg" alt="" width="100%">
<div class="item-info">
    <a href="#" class="btn-have-opacity">立即选购<span class="icon iconfont iconchangyongtubiao-xianxingdaochu-zhuanqu- gd">
    </span></a>
    <a href="#" class="btn-have-opacity">了解更多<span class="icon iconfont iconchangyongtubiao-xianxingdaochu-zhuanqu- gd">
    </span></a>
</div>

    </div>

</div>

<script src="./js/jquery-3.4.1.min.js"></script>
<script>

</script>
</body>
</html>